
<template>
	  <div class="tc-login">
        <section class="login-box">
            <!-- <div class="login-title"> <img class="log" src="./img/log.png" alt=""> 报关易</div> -->
            <div class="login-content">
                <div class="welcome">欢迎登录~</div>
                <h3>报关易</h3>
                <img v-if="false" class="code" src="./img/code.png" alt="">
                <el-input v-model.trim="fromData.userName" @keyup.enter.native="login" placeholder="用户名">
                    <i slot="prefix" class="iconfont iconaccount-fill"></i>
                </el-input>
                <el-input style="margin-top: 20px;" placeholder="密码" @keyup.enter.native="login" v-model.trim="fromData.userPwd" show-password>
                    <i slot="prefix" class="iconfont iconpassword"></i>
                </el-input>
                <el-checkbox class="mt-10" v-model="accountFlag">记住密码</el-checkbox>
                <el-button class="login-btn" type="primary" @click="login">登录</el-button>
                <div class="content-btm clearfix">
                    <!-- <div class="wjmm l">忘记密码</div> -->
                    <!-- <div class="zc r">新用户注册</div> -->
                </div>
                <div v-if="false" class="tc"><i class="iconfont iconweixin"></i></div>
            </div>
            <div class="reference">
                <div class="btm-text"> <img src="./img/btm-icon.png" alt=""> 鄂ICP备20008369号</div>
                <div class="btm-text">Copyright © 2015-2020, tongchebang.net. All rights reserved.</div>
            </div>
        </section>
    </div>
</template>

<script>
import { setStore,getStore,removeStore } from '@/utils/util';
import { login, getUserInfo} from '@/axios/user/user';
import { mapState,mapMutations } from 'vuex';
import md5 from 'js-md5';

let Base64 = require('js-base64').Base64;

export default {
  name: 'login',
  data () {
    return {
        fromData:{
            userName:'',
            userPwd:'',
            clientType: 1,
            loginType: 1
        },
        accountFlag:false
    }
  },
  components: {

  },
  created(){
      if(getStore('user')){
        this.accountFlag = true;
        const user = JSON.parse(Base64.decode(getStore('user')))
        this.fromData = user
      }
  },
  methods:{
      ...mapMutations([
         'SAVE_TOKEN',
         'SAVE_ISSYSTEM',
         'SAVE_MENUDATA',
         'SAVE_EDITABLETABSVALUE',
         'SAVE_EDITABLETABS'
       ]),
      /**
       * @method 记住账号
       */
      saveAccount(){
        this.accountFlag = !this.accountFlag    
      },
      /**
       * @method 登录
       */
      async login(){
        if(!this.fromData.userName){
            this.$message({
                message: '请输入账号',
                type: 'warning'
            })
            return
        }
        if(!this.fromData.userPwd){
            this.$message({
                message: '请输入密码',
                type: 'warning'
            })
            return
        }
        // var userPwd = md5(md5(this.fromData.userName) + md5(this.fromData.userPwd))
        let jsonData = {
            username: this.fromData.userName,
            password: this.fromData.userPwd,
            // clientType: this.fromData.clientType,
            // loginType: this.fromData.loginType
        }
        let data = await login(jsonData)
        if (data.code === 200) {
            this.$store.state.reloadFlag = false
            this.SAVE_TOKEN(data.data.token)
            this.SAVE_EDITABLETABSVALUE()
            this.SAVE_EDITABLETABS()
            // 记住密码
            const user = this.fromData ;
            if(this.accountFlag){
                setStore('user',Base64.encode(JSON.stringify(user)))
            }else{
                removeStore('user')
            }
            getUserInfo().then(res => {
                if (res.code === 200 ) {
                    this.$store.state.userInfo =  {
                        // userHeadImg: res.user.phonenumber,
                        userRealName: res.data.user.nickName,
                        userId: res.data.user.userId,
                        userPhone: res.data.user.phonenumber
                    }
                    if ( res.data.user.userType === '00' ) {
                        this.SAVE_ISSYSTEM(1)
                    } else {
                        this.SAVE_ISSYSTEM(2)
                    }
                    this.$message({
                        message: '登录成功',
                        type: 'success'
                    })
                    this.$router.push({
                        path:'./index'
                    })
                }
            })
        }
      }
  }
};
</script>

<style lang="scss">
@import '../../style/mixin.scss';
@import "./login.scss";
</style>